.m_widget{
    z-index: 0;
    &:extend(.z-depth-main);
    background: @theme_bg_card;
    margin-top: @gap;
    font-family: @fontfamily_base;
    font-size: @fontsize_base;
    &:first-child{
        margin-top: 0;
    }
    // margin-left: @gap;
    border-radius: 5px;
    .enable-trans();
   
    // height: 100%;
    &:hover {
            border: 1px solid #94d4ff;
        }
    @media(max-width: @on_phone) {
        border-radius: 0;
        width: 100%;
        &:hover {
            border: 1px solid #94d4ff;
        }
    }
    width: @width_sidebar;
    max-height: ~"calc(100% - @{height_navbar} - 4 * @{gap})";
    .celan-title {
        font-size: 16px;
        height: 40px;
        line-height: 40px;
        border-bottom: 1px solid #ddd;
        border-radius: 6px 6px 0px 0px;
        background: #fbfbfb;
    }
    .celan-title-i {
        width: 40px;
        text-align: center;
        margin: 0 15px 0 0;
        border-right: 1px solid #ddd;
        float: left;
    }
    .content{
        margin-top: 10px;
        text-align: justify;

        // padding-top: 0; // 适合白色导航栏背景
        max-height: ~"calc(100% - @{height_navbar} - 12.5 * @{gap})";
        ul.entry > li > a{
           padding: 0 @gap;
           line-height:@height_cell;
           height: @height_cell;
           display: flex;
           justify-content: space-between;
           align-content: center;

           .name{
               flex:auto;
               &:extend(.txt-ellipsis);
               color: #5f5d5d;
           }
           .badge{
               flex:none;
               font-size: @fontsize_small;
               color: fade(@theme_text_main, 50%);
           }
           &:hover{
               background: fade(#000000, 10%);
           }
       }
    }
}
.m_widget.author{
    .enable-trans();
    h2{
        text-align: center;
        // color: @theme_text_header;
    }
    .header{
        padding: 0;
        margin-top: -80px;
        padding-bottom: 10px;
        display: flex;
        justify-content: center;
        background-color: transparent;
        @media(max-width: @on_phone){
            padding: @gap/2;
        }
    }
    .avatar-bg{
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
        height: 100px;
        background: url(/img/avatar-bg.jpg) center center no-repeat;
        background-size: cover; 
        @media(max-width: @on_phone){
        border-top-left-radius: 0px;
        border-top-right-radius: 0px;
        }       
    }
    .avatar{
        width: 100px;
        height: 100px;
        margin-top: 24.4px;
        background-color: rgba(255,255,255,0.3);
        border-radius: 100%;
        padding: 5px;
        @media(max-width: @on_phone){
            margin-top: 14px;
        }
    }

    .content{
        margin-top: 0px;

      p{
        font-size: @fontsize_base;
        text-align: center;
      }

        padding-bottom: 0;

    }
    .social-wrapper{
        display: flex;
        justify-content: space-around;
        padding-top: 10px;
        flex-wrap: wrap;
    }

    .avatar-f{
        color: #999;
        text-align: center;
        float: left;
        font-size: 14px;
        width: 100%;
        padding: 0 10px;
        border-top: 1px solid #ddd;
    }
    .avatar-ff{
        color: #666;
        float: left;
        width: 49%;
        padding: 9px 0 11px 0;
        display: block;
        cursor: pointer;
		a:hover{
			color: #0099FF;
		}
    }
	.ffff{
		&:hover{
			color: #0099FF;
		}
	}
    .lrborder{
        border-right: 1px solid #ddd;
    }
}

    .social-icon {
        font-size: 24px;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 45px;
        height: 45px;
        margin: 4px;
        border-radius: 5px;
        margin-bottom: 10px;
        color: #fff;
        .enable-trans();
        &:hover{
            opacity: 0.5;
        }
    }

/*通知侧边栏样式*/
.m_widget.notice{
    .content{
        padding: @gap/2 0;
        padding-top: 0; // 适合白色导航栏背景
    }
}

/*分类侧边栏样式*/
.m_widget.categories{
    .content{
        padding: @gap/2 0;
        padding-top: 0; // 适合白色导航栏背景
    }
}

.m_widget.tagcloud{
    .content{
            padding-left: 15px;
            padding-top: 6px;
            padding-right: 10px;
        a{
            color: #5f5d5d;
            font-size: 12px;
            border: 1px solid #eaeaea;
            float: left;
            width: 31.3333%;
            margin: 0 2% 2% 0;
            margin-bottom: 15px;
            padding: 0 8px;
            height: 29px;
            line-height: 29px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            .enable-trans();
            &:hover{
            color: #fff;
            background-color: #0099FF;
            border: 1px solid #0099FF;
            }
        }
    }
}
.m_widget.contacts{
    .content{
        padding: @gap/2 0;
        padding-top: 0; // 适合白色导航栏背景
    }
}
.m_widget.music{
    .content{
        padding: @gap/2;
        padding-top: 0; // 适合白色导航栏背景
    }
}
.m_widget.links{
     @media(max-width: @on_phone){
            display: none;
        }
    .content{
        padding: @gap/2 0;
        padding-top: 0; // 适合白色导航栏背景
        .name{
          img{
            display: inline;
            border-radius: 100%;
            vertical-align: middle;
            height: 22px;
            width: 22px;
            margin-bottom: 4px;
          }
        }
    }
}